<template>
  <Base :moddle="moddle" :bo="bo" @write="write">
    <template #general>
      <FormItemInput
        v-if="propertyVisible('versionTag')"
        v-model="bo.versionTag"
        label="Version Tag"
        :rules="[{ message: $customTranslate('Must have max length {length}', { length: 64 }), trigger: 'blur', max: 64 }]"
        prop="versionTag"
      />
      <FormItemSwitch
        v-if="propertyVisible('isExecutable')"
        v-model="bo.isExecutable"
        label="Executable"
      />
    </template>
    <template #custom>
      <CollapseItem title="Job execution">
        <FormItemInput
          v-if="propertyVisible('jobPriority')"
          slot="content"
          v-model="bo.jobPriority"
          label="Job Priority"
          prop="jobPriority"
        />
      </CollapseItem>
      <CollapseItem title="Candidate starter">
        <template #content>
          <FormItemInput
            v-if="propertyVisible('candidateStarterGroups')"
            v-model="bo.candidateStarterGroups"
            label="Candidate Starter Groups"
            prop="candidateStarterGroups"
          />
          <FormItemInput
            v-if="propertyVisible('candidateStarterUsers')"
            v-model="bo.candidateStarterUsers"
            label="Candidate Starter Users"
            prop="candidateStarterUsers"
          />
        </template>
      </CollapseItem>
      <CollapseItem title="External task">
        <FormItemInput
          v-if="propertyVisible('taskPriority')"
          slot="content"
          v-model="bo.taskPriority"
          label="Task Priority"
          prop="taskPriority"
        />
      </CollapseItem>
      <CollapseItem title="History cleanup">
        <FormItemInput
          v-if="propertyVisible('historyTimeToLive')"
          slot="content"
          v-model="bo.historyTimeToLive"
          label="History Time To Live"
          prop="historyTimeToLive"
        />
      </CollapseItem>
    </template>
  </Base>
</template>

<script>
import Base from '../embbed/Base'
import CollapseItem from '../ui/CollapseItem'
import FormItemInput from '../ui/FormItemInput'
import FormItemSwitch from '../ui/FormItemSwitch'
import elementHelper from '../../mixins/elementHelper'

export default {
  name: 'Process',
  components: {
    Base,
    CollapseItem,
    FormItemSwitch,
    FormItemInput
  },
  mixins: [elementHelper],
  watch: {
    'bo.versionTag'(val) {
      this.write({ versionTag: val })
    },
    'bo.isExecutable'(val) {
      this.write({ isExecutable: val })
    },
    'bo.candidateStarterGroups'(val) {
      this.write({ candidateStarterGroups: val })
    },
    'bo.candidateStarterUsers'(val) {
      this.write({ candidateStarterUsers: val })
    },
    'bo.historyTimeToLive'(val) {
      this.write({ historyTimeToLive: val })
    },
    'bo.taskPriority'(val) {
      this.write({ taskPriority: val })
    },
    'bo.jobPriority'(val) {
      this.write({ jobPriority: val })
    }
  }
}
</script>
